<template>
    <div>

        <el-form :model="ruleForm" :rules="rules" ref="addForm" label-width="50px" class="demo-ruleForm" style="height: 600px;">
            <el-row :gutter="24">
                <el-col :span="12">
                    <img src="../../../../static/contract/tail.jpg" style="height:auto; width:90%;"/>
                </el-col>

                <el-col :span="12">
                    <el-row :gutter="24">
                        <el-col :span="10">
                            <el-form-item prop="pmdw" label="1.">
                                <el-input type="text" v-model="ruleForm.pmdw" placeholder="拍卖单位"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10">
                            <el-form-item prop="pmje" label="2.">
                                <el-input type="text" v-model="ruleForm.pmje" placeholder="拍卖金额"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="20">
                            <el-form-item prop="remark">
                                <el-input type="textarea" v-model="ruleForm.remark" placeholder="备注"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="13">
                            &nbsp;
                        </el-col>
                        <el-col :span="2">
                            <el-form-item>
                                <el-button type="primary" @click="submit">保存</el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-form v-for="(item, index) in this.lotFormSubmited" :key="index" label-width="50px">
                        <div></div>
                        <el-row :gutter="24">
                            <el-col :span="10">
                                <el-form-item prop="bdlx">
                                    <el-input v-model="item.bdlx" placeholder="标的种类" disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="10">
                                <el-form-item prop="number">
                                    <el-input v-model="item.number" placeholder="数量" disabled></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row :gutter="24">
                            <el-col :span="10">
                                <el-form-item prop="blj">
                                    <el-input v-model="item.blj" placeholder="保留价" disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="10">
                                <el-form-item prop="other">
                                    <el-input v-model="item.other" placeholder="标的明细" disabled></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>

                    <el-form v-for="(item, index) in this.lotForm" :key="index" label-width="50px">
                        <div></div>
                        <el-row :gutter="24">
                            <el-col :span="10">
                                <el-form-item prop="bdlx">
                                    <el-input v-model="item.bdlx" placeholder="标的种类"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="10">
                                <el-form-item prop="number">
                                    <el-input v-model="item.number" placeholder="数量"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="4">
                                <el-button type="success" @click="add">添加</el-button>
                            </el-col>
                        </el-row>
                        <el-row :gutter="24">
                            <el-col :span="10">
                                <el-form-item prop="blj">
                                    <el-input v-model="item.blj" placeholder="保留价"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="10">
                                <el-form-item prop="other">
                                    <el-input v-model="item.other" placeholder="标的明细"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="4">
                                <el-button type="danger" @click="del(index)">删除</el-button>
                            </el-col>
                        </el-row>
                    </el-form>



                    <el-row :gutter="24">
                        <el-col :span="8">
                            &nbsp;
                        </el-col>
                        <el-col :span="6">
                            <el-form-item>
                                <!-- <el-button type="primary" @click="uploadExcel">excel导入</el-button> -->
                                <el-upload
                                class="upload-demo"
                                :limit="1"
                                :on-exceed="handleExceed"
                                :http-request="uploadExcel">
                                    <el-button type="primary">excel导入</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2">
                            <el-form-item>
                                <el-button type="primary" @click="submitLot">提交</el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>

                </el-col>
            </el-row>
        </el-form>
    </div>

</template>
<script>
import {uploadExcel} from '@/api/auctionManage/entrustmentContract'
export default {
    data () {
        return {
            lotForm: [
                {
                    wthtbh: '',
                    pmhbh: '',
                    bdlx: '',//标的类型
                    number: '',//数量
                    blj: '',//保留价
                    other: '',//备注
                }
            ],
            lotFormSubmited:[
                // {
                //     bdlx: '',//标的类型
                //     number: '',//数量
                //     blj: '',//保留价
                //     other: '',//备注
                // }
            ],
            ruleForm: {
                pmdw: "",//拍卖单位
                pmje: '',//拍卖金额
                remark: "",

            },
            // wthtbh: 'wtht000046',
            // contractAdd: false,

            rules: {
                wtr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                bdzmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zblj: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zqpj: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmfs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmdd: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                ggksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                ggjsrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                sfkygg: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                zdjmrs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                sflhpm: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                jfr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jfjzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                jfdd: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jffs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                bgfcdr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jkzffs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jkzfqx: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmccyy: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wscxz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                xdlhts: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wlhclfs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wyzr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zyjjxz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zcwyhmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                rmfymc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                ydy: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yde: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yds: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                htksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                htjsrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                wtrqz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrkhh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrzh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrdh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrqzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmrkhh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrzh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrdh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrqzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmdw: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmje: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                // remark: [
                //     { required: true, message: '请输入', trigger: 'change' }
                // ],
                ggmtmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yjzcjjbfb: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                hlfybk: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                hlfyje: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                hlfxzts: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
            }
        };
    },
    props:{
        wthtbh: {
            type: String
        }
    },
    methods: {
        submit(){
            this.$refs.addForm.validate((valid) => {
                if(valid){
                    this.$emit('submit', this.ruleForm);
                    // this.lotForm[0].wthtbh = this.wthtbh;
                }
                else{
                    this.$message.warning('注意必填项');
                    return ;
                }
            })
        },
        
        del (index) {
            this.lotForm.splice(index, 1);
        },
        add () {
            this.lotForm.push({
                wthtbh: this.wthtbh,
                pmhbh: this.wthtbh.replace('wtht','pmh'),
                bdlx: '',
                number: '',
                blj: '',
                other: '',
            });
        },
        submitLot(){
            this.lotForm[0].wthtbh = this.wthtbh;
            this.lotForm[0].pmhbh = this.wthtbh.replace('wtht','pmh');
            // let obj = {
            //     wthtbh: this.wthtbh
            // }
            // console.log(this.wthtbh);
            // this.lotForm[0].wthtbh = this.wthtbh;
            // console.log(this.lotForm);
            for(let item of this.lotForm){
                item = {
                    wthtbh: item.wthtbh,
                    pmhbh: this.wthtbh.replace('wtht','pmh'),
                    bdlx: item.bdlx,
                    number: parseInt(item.number),
                    blj: parseInt(item.blj),
                    other: item.other,
                    qyid: 6
                }
                // item.number = parseInt(item.number);
                // item.blj = parseInt(item.blj);
                // let data = Object.assign(item, obj);
                console.log(item);
                this.$emit('submitLot', item);
            }

        },
        uploadExcel(file){
            // let wthtbh = 'wtht000048';
            
            console.log(file);
            let formdata = new FormData();
            formdata.append('file', file.file);
            formdata.append('wthtbh', this.wthtbh);

            uploadExcel(formdata).then((res) => {
                if(res){
                    console.log(res);
                    this.lotFormSubmited = res.data;
                }
            });
            // updateExcel(formdata).then((res) => {
            //     // console.log(this.ruleForm);
            //     if(res){
            //         console.log(res.msg);
            //         this.dialogClose();
            //     }
            // })
        },
        handleExceed(file) {
            console.log(file);
        },
        // beforeRemove(file) {
        //     return this.$confirm(`确定移除 ${ file.name }？`);
        // },

    },
    mounted(){

    }

}
</script>
